<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">

<head>
    <title th:text="${pageTitle}"></title>
    <div data-th-replace="layout/head-top"></div>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInLeft">
        <div data-th-replace="common/functionDepict"></div>
        <div>
            <div class="row">
                <div class="creat-step-wrap clearfix">
                    <div id="abc1" class="col-sm-6 creat-step-current">
                        <div class="creat-step-bx">
                            <span class="vam fs24 c-4e"><i class="fa fa-hand-pointer-o"></i></span>
                            <div class="creat-step-txt">
                                <h5><span class="fs18 c-222">第一步：基本信息</span></h5>
                                <span class="fs14 c-999">免费直播管理的基本信息</span>
                            </div>
                        </div>
                    </div>
                    <div id="abc2" class="col-sm-6 secondStep">
                        <div class="creat-step-bx">
                            <span class="vam fs24 c-4e"><i class="fa fa-hand-peace-o"></i></span>
                            <div class="creat-step-txt">
                                <h5><span class="fs18 c-222">第二步：描述信息</span></h5>
                                <span class="fs14 c-999">免费直播管理的描述信息</span>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 第一步开始 -->
                <div class="pt10">
                    <div class="col-sm-9">
                        <div class="ibox float-e-margins">
                            <div class="ibox-title">
                                <h5>填写基本信息</h5>
                            </div>
                            <div class="ibox-content clearfix pt10">
                                <form class="form-horizontal m-t" id="courseOpen-form">
                                    <div class="form-horizontal">
                                        <input name="id" th:value="${courseOpen['id']}" type="hidden"/>
                                        <input name="imageJson" th:value="${courseOpen['imageJson']}" type="hidden"/>
                                        <input name="replay" th:value="${#strings.isEmpty(courseOpen['replay'])}?'1':${courseOpen['replay']}" type="hidden"/>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i> 免费直播名称</label>
                                            <div class="col-sm-8">
                                                <input class="validate-data form-control" type="text" id="title" name="courseName" th:value="${courseOpen['courseName']}"/>
                                                <span class="help-block m-b-none c-999"> 免费直播名称 限30个字符以内</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <input type="hidden" name="subjectIds" id="subjectIds" th:value="${courseOpen['subjectIds']}"/>
                                            <label class="col-sm-2 control-label"><i class="c-red">*</i> 选择专业</label>
                                            <div class="col-sm-8">
                                                <div id="course-open-subject-box"></div>
                                                <div id="course-open-subject-context"></div>
                                                <span class="help-block m-b-none c-999">选择所属专业或去新建</span>
                                            </div>
                                            <div class="col-sm-2 mt10">
                                                <a href="javascript:void(0)" onclick="getRedirectMenu(baseloaction+'/admin/manage/subject/toSubjectList')">
                                                    <i class="fa fa-plus"></i> 新建专业
                                                </a>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i>  授课讲师</label>
                                            <div class="col-sm-8">
                                                <p>
                                                    <button class="btn btn-primary selectTeacher" data-type="0" type="button"><i class="fa fa-plus"></i> 选择授课讲师</button>
                                                </p>
                                                <div id="teacher-div" class="well m-t mt10 no-padding">
                                                    <ul class="list-group" id="teacherList">
                                                        <li class="list-group-item">
                                                            <input id="teacher-Id" type="hidden" name="teacherId" th:value="${courseOpen['teacherId']}"/>
                                                            <span class="pull-right deleteTeacher" data-type="0" th:classappend="${#maps.isEmpty(courseOpen['teacher'])}?'hide':''">
                                                                <a href="javascript:void(0);" title="移除" class="c-999 fs14"><i id="teacher" class="fa fa-remove"></i></a>
                                                            </span>
                                                            <span class="fs14" id="teacher-Name" th:text="${#maps.isEmpty(courseOpen['teacher'])}?'请选择授课讲师':${courseOpen['teacher']['teacherName']}"></span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group" hidden>
                                            <input name="playType" value="CC">
                                        </div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"> 允许回放</label>
                                            <div class="col-sm-10">
                                                <div class="checkbox i-checks">
                                                    <label style="padding: 0">
                                                        <input type="checkbox" th:checked="${courseOpen['replay']}==2" id="replay"> <i></i> 允许回放
                                                    </label>
                                                </div>
                                                <span class="help-block m-b-none c-999">  免费直播直播结束后是否允许回放。回放将在直播结束后一段时间后可用</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed back-code" th:classappend="${courseOpen['replay']}==2?'':'hide'"></div>
                                        <div class="form-group back-code" th:classappend="${courseOpen['replay']}==2?'':'hide'">
                                            <label class="col-sm-2 control-label text-right">直播回放</label>
                                            <div class="col-sm-3">
                                                <input class="form-control" readonly name="backCode" id="backCode" th:value="${courseOpen['backCode']}"/>
                                                <input   name="playBackType" type="hidden" th:value="${courseOpen['playBackType']}"/>

                                                <span class="help-block m-b-none c-999">直播回放视频码，用于直播结束后的回放</span>
                                            </div>
                                            <p>
                                                <label class="col-sm-1 control-label "> 视频码</label>
                                                &nbsp;  &nbsp;
                                                <button class="btn btn-primary " type="button" id="uploadVideo">
                                                    <i class="fa fa-plus"></i>&nbsp;上传视频
                                                </button>
                                                <button class="btn btn-primary " type="button" id="selectVideo">
                                                    <i class="fa fa-mouse-pointer"></i>&nbsp;选择视频
                                                </button>
                                            </p>
                                            <th:block th:if="${playback}!=null">
                                                <label class="col-sm-1 control-label text-right"> 回放地址</label>
                                                <div class="col-sm-3">
                                                    <select  id="backUrl" class="form-control mb10"  >
                                                        <option value="">请选择录制结束时间</option>
                                                        <option th:each=" back:${playback}" th:selected="${courseOpen['backCode']} eq ${back['replayUrl']}"  th:attrappend="data-live=${back['liveId']},data-playback=${back['id']}" th:value="${back['replayUrl']}" th:text="${back['stopTime']}+(${back['replayUrl']}==null or ${back['replayUrl']} eq ''?'（回放地址处理中请稍后再试）':'')"></option>
                                                    </select>
                                                    <span class="help-block m-b-none c-999">显示为直播录制结束的时间节点（视频码和回放地址只能二选一）</span>
                                                    <input type="hidden" th:value="${courseOpen['liveId']}" name="liveId" >
                                                    <input type="hidden"  th:value="${courseOpen['playbackId']}" name="playbackId" >
                                                </div>
                                            </th:block>
                                        </div>
                                        <div class="hr-line-dashed"></div>

                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right "> <i class="c-red">*</i> 直播房间类型</label>
                                            <div class="col-sm-8 radio i-checks">
                                                <label>
                                                    <input type="radio" value="0" name="liveBilling"  th:checked="${courseOpen['liveBilling']}==0?'true':'false'"><i></i> 并发直播
                                                </label>
                                                <label>
                                                    <input type="radio" value="1" name="liveBilling"  th:checked="(${courseOpen['liveBilling']}==1)?'true':'false'"><i></i> 小班互动直播
                                                </label>
                                                <span class="help-block m-b-none c-999">直播房间类型必须与创建的直播间类型必须保持一致</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i>  直播间识别码</label>
                                            <div class="col-sm-8">
                                                <span class="c-red" th:if="${isLive}==null and ${vlasProviderMap['type']}=='96K'">
                                                    &nbsp;&nbsp;&nbsp;平台检测到您还未开通云视频服务
                                                    <span  th:if="${isLive}==null" th:text="'，中的直播服务'"></span>
                                                    ，开通后才可使用
                                                    <span th:if="${isLive}==null" th:text="'直播服务。'"></span>
                                                    <button onclick="getRedirectMenu('/admin/course/serviceConfig',false)" type="button" class="btn btn-outline btn-primary">点击开通</button>
                                                </span>
                                                <input class="validate-data form-control" id="liveUrl" type="text" name="liveUrl" th:value="${courseOpen['liveUrl']}"/>
                                                <span class="help-block m-b-none c-999">  请填写直播间识别码</span>
                                            </div>
                                            <div th:if="${vlasProviderMap['type']}=='CC'" class="col-sm-2 mt10">
                                                <a href="javascript:void(0)" id="newCreateLiveCC">
                                                    <i class="fa fa-plus"></i> 新建直播间
                                                </a>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right "> <i class="c-red">*</i> 直播间ID</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="roomId" name="roomId" th:value="${courseOpen['roomId']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right "> <i class="c-red">*</i> 讲师地址</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="teacherUrl" name="teacherUrl" th:value="${courseOpen['teacherUrl']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i>  讲师地址二维码</label>
                                            <div class="col-sm-3">
                                                <div class="image">
                                                    <img alt="讲师地址二维码" id="teacherQRCodeInp" class="img-responsive" th:src="@{{path}/admin/v3/img/default/default-pic.jpg?v={v}(path=${staticPath},v=${v})}"/>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right "> <i class="c-red">*</i> 讲师参加码</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="teacherCode" name="teacherCode" th:value="${courseOpen['teacherCode']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right">学员地址</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="studentUrl" name="studentUrl" th:value="${courseOpen['studentUrl']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i>  学员地址二维码</label>
                                            <div class="col-sm-3">
                                                <div class="image">
                                                    <img alt="学员地址二维码" id="studentQRCodeInp" class="img-responsive" th:src="@{{path}/admin/v3/img/default/default-pic.jpg?v={v}(path=${staticPath},v=${v})}"/>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right">学员参加码</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="studentCode" name="studentCode" th:value="${courseOpen['studentCode']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i> 助教地址</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="adminUrl" name="adminUrl" th:value="${courseOpen['adminUrl']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i> 助教参加码</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="adminCode" name="adminCode" th:value="${courseOpen['adminCode']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i>  授课时间</label>
                                            <div class="col-sm-10">
                                                <input placeholder="开始时间" readonly class="laydate-icon form-control layer-date" id="openTime" name="openTime" th:value="${courseOpen['openTime']}"/>
                                                _
                                                <input placeholder="结束时间" readonly class="laydate-icon form-control layer-date" id="endTime" name="endTime" th:value="${courseOpen['endTime']}"/>
                                                <span class="help-block m-b-none c-999">  请填写授课时间</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right">回放地址</label>
                                            <div class="col-sm-8">
                                                <input class="form-control" id="replayUrl" name="replayUrl" th:value="${courseOpen['replayUrl']}" type="text"/>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i> 免费直播管理封面</label>
                                            <div class="col-sm-8">
                                                <p>
                                                    <button class="btn btn-primary " id="courseOpenImageBtn" type="button"><i class="fa fa-image"></i>&nbsp;选择图片</button>
                                                </p>
                                                <div class="clearfix" id="coverImage">
                                                    <div class="file-box">
                                                        <div class="file">
                                                            <span class="corner" title="删除" id="remove-image"><i class="fa fa-remove"></i></span>
                                                            <div class="image">
                                                                <img alt="免费直播封面" id="course-open-image" class="img-responsive" th:src="!${#maps.isEmpty(courseOpen['imageMap'])} ? ${courseOpen['imageMap']['pcUrlMap']['large']} : @{{path}/admin/v3/img/default/default-pic.jpg?v={v}(path=${staticPath},v=${v})}"/>
                                                            </div>
                                                            <div class="file-name">
                                                                <p id="file-names" th:text="!${#maps.isEmpty(courseOpen['imageMap'])} and ${courseOpen['imageMap']['fileName']}!=null ? ${courseOpen['imageMap']['fileName']}:'文件名'"></p>
                                                                <small id="create-time" th:text="!${#maps.isEmpty(courseOpen['imageMap'])} and ${courseOpen['imageMap']['createTime']}!=null ? ${courseOpen['imageMap']['createTime']}:'上传时间'"></small>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right "> 提前进入时间</label>
                                            <div class="col-sm-8">
                                                <input class="form-control data-num" maxlength="6" id="pre-enter-time" name="preEnterTime" th:value="${#strings.isEmpty(courseOpen['preEnterTime'])}?'0':${courseOpen['preEnterTime']}" type="text">
                                                <span class="help-block m-b-none c-999"> 不填写默认为0。单位：分钟</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <!--<div class="form-group">
                                            <label class="col-sm-2 control-label text-right">最大观看课程人数</label>
                                            <div class="col-sm-8">
                                                <input class="validate-data form-control data-num" maxlength="6" type="text" name="openNum" th:value="${#strings.isEmpty(courseOpen['openNum'])}?'0':${courseOpen['openNum']}"/>
                                                <span class="help-block m-b-none c-999">   如不填写或0视为不限制，如填写，则直播间听课最大人数为此数字</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>-->
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right">助教一</label>
                                            <div class="col-sm-8">
                                                <p>
                                                    <button class="btn btn-primary selectTeacher" data-type="1" type="button"><i class="fa fa-plus"></i> 选择助教</button>
                                                </p>
                                                <div id="tutorOne-div" class="well m-t mt10 no-padding">
                                                    <ul class="list-group" id="tutorFirst">
                                                        <li class="list-group-item">
                                                            <input id="tutorOne-Id" type="hidden" name="tutorOne" th:value="${courseOpen['tutorOne']}"/>
                                                            <span class="pull-right deleteTeacher" data-type="1" th:classappend="${#maps.isEmpty(courseOpen['teacherOne'])}?'hide':''">
                                                                <a href="javascript:void(0);" title="移除" class="c-999 fs14">
                                                                    <i id="tutorOne" class="fa fa-remove"></i>
                                                                </a>
                                                            </span>
                                                            <span class="fs14" id="tutorOne-Name" th:text="${#maps.isEmpty(courseOpen['teacherOne'])}?'请选择助教讲师':${courseOpen['teacherOne']['teacherName']}">助教1</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right">助教二</label>
                                            <div class="col-sm-8">
                                                <p>
                                                    <button class="btn btn-primary selectTeacher" data-type="2" type="button"><i class="fa fa-plus"></i> 选择助教</button>
                                                </p>
                                                <div id="tutorTwo-div" class="well m-t mt10 no-padding">
                                                    <ul class="list-group" id="tutorSecond">
                                                        <li class="list-group-item">
                                                            <input id="tutorTwo-Id" type="hidden" name="tutorTwo" th:value="${courseOpen['tutorTwo']}"/>
                                                            <span class="pull-right deleteTeacher" data-type="2" th:classappend="${#maps.isEmpty(courseOpen['teacherTwo'])}?'hide':''">
                                                                <a href="javascript:void(0);" title="移除" class="c-999 fs14">
                                                                    <i id="tutorTwo" class="fa fa-remove"></i>
                                                                </a>
                                                            </span>
                                                            <span class="fs14" id="tutorTwo-Name" th:text="${#maps.isEmpty(courseOpen['teacherTwo'])}?'请选择助教讲师':${courseOpen['teacherTwo']['teacherName']}">助教2</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <div class="col-sm-8 col-sm-offset-2">
                                                <button id="save-continue" class="btn btn-primary ml10 save-btn-box" type="button">保存，下一步</button>
                                                <button id="save-back" class="btn btn-danger save-btn-box" type="button">保存，返回</button>
                                                <button id="cancel" class="btn btn-white ml10" type="button">取消</button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div data-th-replace="common/importantNotes"></div>
                </div>
            </div>
        </div>
    </div>
    <div data-th-replace="layout/head-footer"></div>
    <script type="text/javascript" th:src="@{{path}/admin/libs/plugins/layer/laydate/laydate.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/upload/common-webuploader.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/manage/teacher/common-select-teacher-list.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/course/live/create-live.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script th:src="@{{path}/admin/business/course/cloud/select-common-video.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/course/open/save-courseOpen.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/common/qrcode/jquery.qrcode.min.js?v={v}(path=${staticPath}, v=${v})}"></script>
</body>
</html>
